<template>
  <el-dialog :model-value="visible" :draggable="true" title="审核" width="40%">
    <el-form ref="auditFormRef" :model="form" :rules="rules" label-width="120px">
      <el-form-item label="审核结果：" prop="auditStatus">
        <el-radio-group v-model="form.auditStatus" class="ml-4" @change="onAuditStatusChange">
          <el-radio value="2" size="large">通过</el-radio>
          <el-radio value="3" size="large">拒绝</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item v-if="showAuditRemark" label="拒绝原由：" prop="auditRemark">
        <el-input v-model="form.auditRemark" type="textarea" rows="3" />
      </el-form-item>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button type="primary" @click="handleAudit"> 提交 </el-button>
        <el-button @click="cancel">取 消</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script lang="ts" setup>
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const auditFormRef = ref<ElFormInstance>();
const props = defineProps({
  rowData: {
    type: Object,
    default: null
  },
  visible: {
    type: Boolean,
    default: false
  }
});
const emit = defineEmits(['update:modelValue', 'loadList', 'ok']);
let form = reactive<any>({
  id: undefined,
  auditTime: undefined,
  auditStatus: '2',
  auditRemark: undefined
});
const rules = reactive({
  auditStatus: [{ required: true, message: '状态不能为空', trigger: 'blur' }],
  auditRemark: [{ required: true, message: '请说明拒绝原因', trigger: 'blur' }]
});

/*如果是拒绝，需说明理由*/
const showAuditRemark = ref(false);
const onAuditStatusChange = (e) => {
  showAuditRemark.value = e === '3';
};
/** 表单重置 */
const reset = () => {
  form = {};
};
/** 取消按钮 */
const cancel = () => {
  reset();
  emit('update:modelValue', false);
};
/** 数据提交*/
const handleAudit = () => {
  auditFormRef.value?.validate(async (valid: boolean) => {
    if (valid) {
      form.id = props.rowData.id;
      emit('ok', form);
      emit('update:modelValue', false);
    }
  });
};
</script>
